In this article, I will show you how to create html moving text, fetch the data from the database and bind in html marquee tag using asp.net mvc.
Here I am using Northwind database. You can download it from following link.
Open Microsoft sql management studio and right click on the database and attach it.
Step 1: Create an asp.net mvc application and create an ado.net entity data model using table Customer in the model folder and generate entity for that.
Step 2: Create an asp.net mvc project and right click on the controller folder and create a new controller and name it as HomeController. Inside the HomeController copy and paste the following code.
public ActionResult Index()
{
models db = new models();
return View(db.Customers.ToList());
}
Step 3: Right click on the index view and create a razor view named as index. Copy and paste the html code for scrolling text.
@modelIEnumerable<MymvcApp.Models.Customer>
@{
ViewBag.Title = "HTML marquee tag dynamical bind";
}
<h1 style="text-align:center;">Fetch data fromdatabase and bind in HTML marquee tag </h1>
<marquee direction="up" onmouseover="this.stop()" onmouseout="this.start()"
scrolldelay="300?" style="height: 213px">
@foreach (var item in Model)
{
<h3 style="text-align:center;color:#055996">@Html.Raw(item.CompanyName)</h3>
}
</marquee>
Description: When you run the application, the customer names are marquee from bottom to top. You can also set marquee right to left and also you can stop the marquee using the option onmouseover property by this.stop() and onmouseout by this.start().wherever the user hovers on the marquee tag, it will stop running and outside the marquee tag, the text will start to run.
Marquee html example:
Post your comments / questions
Recent Article
- FieldError: Cannot resolve keyword 'id' into field in Django project
- How to hide the ID field from the Django admin?
- It is impossible to add a non nullable field without specifying a default. Django error
- ImportError: cannot import name 'url' from 'django.conf.urls' - Django Error
- How to Enable Virtualization in BIOS Security Settings in Intel Processors For Android Studio?
- Dependency 'androidx.activity:activity:1.8.0' requires libraries and applications that depend on it.
- AttributeError: 'NoneType' object has no attribute 'get_text' - Python
- ModuleNotFoundError: No module named 'openpyxl' - Python
Related Article